<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Awesome-pyecharts</title>
    <script src="https://cdn.bootcss.com/jquery/3.0.0/jquery.min.js"></script>
    <script type="text/javascript" src="https://assets.pyecharts.org/assets/echarts.min.js"></script>

</head>
<body>
    <div style="overflow: auto; white-space: nowrap;">
		<div id="bar_1" style="width:900px; height:450px; display: inline-block;"></div>
		<div id="bau_2" style="width:900px; height:450px; display: inline-block;"></div>
    <div>
	<div style="overflow: auto; white-space: nowrap;">
		<div id="bat_3" style="width:900px; height:450px; display: inline-block;"></div>
		<div id="bas_4" style="width:900px; height:450px; display: inline-block;"></div>
	<div>
    <a href="./line">切换折线</a>
    <a href="./bard">3d柱图</a>
    <script>

        var char1 = echarts.init(document.getElementById('bar_1'), 'white', {renderer: 'canvas'});
        var char2 = echarts.init(document.getElementById('bau_2'), 'white', {renderer: 'canvas'});
		var char3 = echarts.init(document.getElementById('bat_3'), 'white', {renderer: 'canvas'});
		var char4 = echarts.init(document.getElementById('bas_4'), 'white', {renderer: 'canvas'});
        $(
            function () {
			    set_data(char1,"1");
				set_data(char2,"2");
				set_data(char3,"3");
				set_data(char4,"4");
				setInterval(my_set_data(char1,"1"), 120000);
				setInterval(my_set_data(char2,"2"), 120000);
				setInterval(my_set_data(char3,"3"), 120000);
				setInterval(my_set_data(char4,"4"), 120000);
            }
        );
		function my_set_data(chart,n){ 
            return function(){ 
                set_data(chart,n); 
            } 
        }
		function set_data(chart,n){ 
            $.ajax({
                type: "GET",
                url: "http://192.168.50.207:9000/barChart?name=" + n,
                dataType: 'json',
                success: function (result) {
                    chart.setOption(result);
                }
            });
        } 
    </script>
</body>
</html>